import React, { useEffect, useState } from 'react'
import {
  Row,
  Col,
  Button,
  Form,
} from 'antd'
import { formItemLayout } from '@/utils/utils'

const SearchBox = props => {
  const { handleReset= () => {}, handleSearch = () => {}, getFields = () => {} } = props
  const [hasSearchBtn, setSearchBtn] = useState(JSON.parse(localStorage.getItem('hasSearchBtn')))

  useEffect(() => {
    const isShow = JSON.parse(localStorage.getItem('hasSearchBtn'))
    setSearchBtn(isShow)
  })
  
  return (
    hasSearchBtn && <Form onSubmit={handleSearch} {...formItemLayout}>
        <Row gutter={24}>
          {getFields()}
          <Col span={6} style={{ textAlign: 'right', marginTop: 5 }}>
            <Button type="primary" htmlType="submit">
              查询
            </Button>
            <Button style={{ marginLeft: 8 }} onClick={handleReset}>
              清除
            </Button>
          </Col>
        </Row>
      </Form>
  )
}

export default SearchBox